import React, { useEffect } from 'react'
import { Table } from 'antd'

const colums: any = ({}: any) => [
  {
    title: '序号',
    dataIndex: 'id',
    align: 'center',
    render: (_: any, record: any, index: number) => <div>{index + 1}</div>
  },
  {
    title: '物品名称',
    dataIndex: 'itemName',
    align: 'center',
    fixed: 'left',
    render: (age1: any) => <a>{age1}</a>
  },
  {
    title: '数量（单位）',
    dataIndex: 'age2',
    align: 'center',
    render: (itemName: any, record: any) => (
      <div>
        {record.itemStock.totalNumber} ({record.itemStock.unitName})
      </div>
    )
  },
  {
    title: '规格',
    dataIndex: 'specs',
    align: 'center',
    key: 'specs'
  },
  {
    title: '特征',
    dataIndex: 'feature',
    align: 'center',
    key: 'feature'
  },
  {
    title: '实物所在地',
    dataIndex: 'location',
    align: 'center',
    key: 'location',
    fixed: 'right'
  },
  {
    title: '库架编号',
    dataIndex: 'storeLocationNo',
    align: 'center',
    key: 'storeLocationNo',
    fixed: 'right'
  },
  {
    title: '备注',
    dataIndex: 'remark',
    key: 'remark',
    align: 'center',
    fixed: 'right'
  }
]

const MovedList = ({ handleGetCastItems, castItems }: any) => {
  useEffect(() => {
    handleGetCastItems()
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [])
  return (
    <div>
      <Table
        pagination={{
          size: 'default',
          total: castItems.length,
          showSizeChanger: true,
          showQuickJumper: true,
          showTotal: total => `共 ${total} 条`
        }}
        rowKey="id"
        dataSource={castItems}
        columns={colums({})}
        bordered
      />
    </div>
  )
}

export default MovedList
